<template>
  <div class="user-profile">
    <van-nav-bar
      class="van-app"
      title="个人信息"
      left-arrow
      @click-left="$router.back()"
    />
    <!-- <van-cell-group> -->
    <input type="file" hidden ref="filt" accept="image/*" @change="filtchange" />
    <van-cell title="头像" is-link center
        @click="$refs.filt.click()"
    >
        <van-image width="30" round height="30" fit="cover" :src="userDate.photo" />
    </van-cell>
    <van-cell title="昵称" @click="isshow = true" is-link :value="userDate.name"/>
    <van-cell title="性别" @click="smiex = true" is-link :value="userDate.gender === 0?'男':'女'"/>
    <van-cell title="生日" @click="isbirthday = true" is-link :value="userDate.birthday"/>
   
  <!-- 弹出层 -->
  <van-popup v-model="isshow" position="bottom" :style="{ height: '100%' }" >
      <userdataxiaq v-if="isshow" :name="userDate.name" @upDataname="userDate.name = $event" @colse="isshow = false"></userdataxiaq>
  </van-popup>
  <!-- 修改性别的弹出层 -->
  <van-popup v-model="smiex" position="bottom" :style="{ height: '40%' }">
      <userNameUp @colse="smiex = false" v-model="userDate.gender"></userNameUp>
  </van-popup>
  <!-- 修改生日 -->
  <van-popup v-model="isbirthday" position="bottom" :style="{height:'50%'}">
      <userdatabirthday v-if="isbirthday" v-model="userDate.birthday" @colse="isbirthday = false"></userdatabirthday>
  </van-popup>
  <!--  修改头像-->
  <van-popup v-model="ispoto" position="bottom" :style="{height:'50%'}">
      走向
  </van-popup>
  </div>
</template>
<script>
import { getUserDatess } from "@/api/user"
import userdataxiaq from './userDatexiaq'
import userdatabirthday from './userDatabirthday.vue'
import userNameUp from './upUserxinb'
// console.log(userdataxiaq)
// console.log(userDatabirthday)
export default {
  name: "user-profile",
  components:{
      userdataxiaq,
      userNameUp,
      userdatabirthday
  },
  created(){
      this.getUserDate()
      

  },
  methods:{
      async getUserDate(){
          let {data} = await getUserDatess()
        //   console.log(data.data)
          this.userDate = data.data
        //   console.log(this.userDate)

      },
      filtchange(){
          console.log(555)
          this.ispoto = true
          this.$refs.filt.value = ""
      }

  },
  data(){
      return {
          userDate:null,
          isshow:false,
          smiex:false,
          isbirthday:false,
          ispoto:false

      }
  }
};
</script>
<style scoped lang="less">
 .user-profile {
     /deep/.van-cell__title {
         text-align: left;
     }
     .van-popup--bottom {
        background-color: #f5f7f9;
    }
 }

</style>